﻿body {
    background:#2D3A4B;
    height:100vh;
    position:relative;
}
.ds {
    display:none;
}
.search {
    display:flex;
    height:100px;
    background:white;
    border-bottom:5px solid #808080;
}
.sc,.my,.ct{
    width:100%;
}
.ct {
    min-width:500px;
    display:flex;
    align-items:center;
    font-size:20px;
}
.ct-icon {
    width:60px;
    height:60px;
    border-radius:50%;
    background:black;
    overflow:hidden;
    margin:20px;
}
.ct-img {
    width:100%;
    height:100%;
}
.sc {
    display:flex;
    align-items:center;
}
.sc-inp {
    border:none;
    outline:none;
    width:150px;
    padding:3px;
    margin-left:10px;
}
.sc-item {
    overflow:hidden;
    width:200px;
    height:35px;
    border-radius:20px;
    border:1px black solid;
}
.sc-img {
    width:25px;
    height:25px;
    vertical-align:middle;
}
.sc-my {
    min-width:150px;
    margin-left: 100px;
    display:flex;
    justify-content:center;
    align-items:center;
    line-height:32px;
    position:relative;
    height:100px;
}
.sc-ps {
    margin:0 10px;
    width:32px;
    height:32px;
}
.sc-ha {
    position:absolute;
    width:80px;
    height:40px;
    background:white;
    top:70px;
    padding:5px;
    right:0px;
    text-align:center;
    border-bottom:5px solid #808080;
    transform:translateY(-50px);
    display:none;
}
.sc-my:hover .sc-ha{
    top:150px;
    display:block;
}
.my {
    display:flex;
    align-items:center;
}
    .my div {
        width:70px;
        text-decoration:underline;
    }
.content {
    display:flex;
}
.left {
    margin:0 8px;
    margin-top:100px;
    min-width:300px;
    display:flex;
    background:white;
    max-height:285px;
}
.carousel-item img {
    width:100%;
}
.item {
    width:100%;
    padding:1px 0;
}
.item div {
    margin:1px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    text-align:center;
    background:#11a7c2;
    color:white;
    font-size:22px;
    height:140px;
    transition: all .2s ease;
}
.item div:hover {
    background:#ff6a00;
    font-size:25px;
}
.item div img {
    width:32px;
    height:32px;
    display:block;
    margin:10px auto;
}

.center {
    height:80vh;
    min-width:250px;
    margin:5px;
    display:flex;
    flex-direction:column;
    align-items:center;
    background:white;
    justify-content:space-around;
}
.ct-item {
    width:100px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2px 5px;
    width:200px;
    height:40px;
    border-radius:20px;
    border:1px black solid;
    
}
.ct-imag {
    margin-right:10px;
    width:30px;
    height:30px;
}
.right {
    flex:2;
    margin:5px;
    padding:10px;
    background:white;
}